<template>
  <el-descriptions class="margin-top" title="所属班级" :column="2" size="medium" border>
    <template slot="extra">
      <el-button type="primary" size="small">操作</el-button>
    </template>
    <el-descriptions-item class="my-content">
      <template slot="label">
        <i class="el-icon-house"></i>
        班级
      </template>
      {{stuclass.classname}}
    </el-descriptions-item>
    <el-descriptions-item>
      <template slot="label">
        <i class="el-icon-c-scale-to-original"></i>
        班级编号
      </template>
      {{stuclass.classid}}
    </el-descriptions-item>
    <el-descriptions-item>
      <template slot="label">
        <i class="el-icon-school"></i>
        班级信息
      </template>
      {{stuclass.classinfo}}
    </el-descriptions-item>
    <el-descriptions-item>
      <template slot="label">
        <i class="el-icon-tickets"></i>
        课程
      </template>
      <span v-for="c in stuclass.classcourses" :key="c">{{c}}&nbsp;&nbsp;</span>
    </el-descriptions-item>
  </el-descriptions>
</template>

<script>
    import {mapState} from 'vuex';
    export default {
        name:'SClassCenter',
         computed:{
            ...mapState('userOptions',['stuclass']),
        },
    }
</script>

<style>

</style>